<?php
/* @var $this BookingController */

$this->breadcrumbs=array(
	'Booking',
);
?>
<div class="booking-overlay"></div>
<div class="booking">
    <div class="booking-header">
        <span>Sơ đồ vé sự kiện <strong><?php echo $model->title; ?></strong> tại <strong>Nhà hát lớn Hà Nội</strong></span>
    </div>
    <div class="booking-content">
        <div class="booking-map">
            <div class="booking-seats" style="zoom: 0.54">
                <!-- Booking Note -->
                <?php foreach ($seatNotes as $data) {
                    // Seat id
                    echo "<div id='note-", $data->id, "'";
                    // Seat class
                        // Seat basic class
                    echo " class='booking-note ";
                        // Seat rotate
                    if ($data->graph_angle > 0)
                        echo " rotate-", abs($data->graph_angle);
                    else
                        echo " rotate-minus-", abs($data->graph_angle);
                        // Seat status
                        // Seat position
                    echo "' style='top: ", ($data->graph_y+($data->coordinate_y-1)*35), "px; left: ", ($data->graph_x+($data->coordinate_x-1)*35), "px;'";
                        // Seat title
                    echo "data-toggle='tooltip' data-original-title='", $data->id, " - ", $data->title, "'>";
                        // Seat number
                    if ($data->graph_angle > 0)
                        echo "<span class='rotate-minus-", abs($data->graph_angle), "'>", $data->title, "</span></div>";
                    else
                        echo "<span class='rotate-", abs($data->graph_angle), "'>", $data->title, "</span></div>";
                } ?>
                <!-- Booking Block -->
                <?php foreach ($seatBlocks as $data) {
                    // Seat id
                    echo "<div id='block-", $data->id, "'";
                    // Seat class
                        // Seat basic class
                    echo " class='booking-block ";
                        // Seat rotate
                    if ($data->graph_angle > 0)
                        echo " rotate-", abs($data->graph_angle);
                    else
                        echo " rotate-minus-", abs($data->graph_angle);
                        // Seat status
                        // Seat position
                    echo "' style='top: ", ($data->graph_y+($data->coordinate_y-1)*35), "px; left: ", ($data->graph_x+($data->coordinate_x-1)*35), "px;'";
                        // Seat title
                    echo "data-toggle='tooltip' data-original-title='", $data->id, " - ", $data->title, "'>";
                        // Seat number
                    if ($data->graph_angle > 0)
                        echo "<span class='rotate-minus-", abs($data->graph_angle), "'>", $data->title, "</span></div>";
                    else
                        echo "<span class='rotate-", abs($data->graph_angle), "'>", $data->title, "</span></div>";
                } ?>
                <!-- Booking Seats -->
                <?php foreach ($model->tickets as $x => $ticket) {
                    // Booking ticket
                    echo "<div class='booking-block' style='";
                    echo "bottom: ", ($x*34+20), "px; right: 50px; width: 200px !important; text-align: right;'>";
                    echo "<strong>", number_format($ticket->price, 0, '.', ','), " VNĐ</strong>";
                    echo "</div>";
                    echo "<div class='booking-seat booking-", $ticket->brief, "' style='";
                    echo "bottom: ", ($x*35+20), "px; right: 10px;'><span>x</span>";
                    echo "</div>";
                    // Booking seat
                    foreach ($ticket->seats as $data) {
                        // Seat id
                        echo "<div id='seat-", $data->seat->id, "'";
                        // Seat class
                            // Seat basic class
                        echo " class='booking-seat booking-", $ticket->brief;
                            // Seat rotate
                        if ($data->seat->graph_angle > 0)
                            echo " rotate-", abs($data->seat->graph_angle);
                        else
                            echo " rotate-minus-", abs($data->seat->graph_angle);
                            // Seat status
                        if ($data->status === 'I')
                            echo " booking-muted";
                            // Seat position
                        echo "' style='top: ", ($data->seat->graph_y+($data->seat->coordinate_y-1)*35), "px; left: ", ($data->seat->graph_x+($data->seat->coordinate_x-1)*35), "px;'";
                            // Seat title
                        echo "data-toggle='tooltip' data-original-title='", $data->id, " - ", $ticket->title, " - ", $data->seat->block->title, $data->seat->number, " - ", number_format($ticket->price, 0, ',', '.'), " VNĐ'";
                            // Seat onClick
                        if ($data->status === 'A')
                            echo " onclick='javascript:checkSeat(", $data->seat->id, ", ", $ticket->id, ")'>";
                            // Seat number
                        if ($data->seat->graph_angle > 0)
                            echo "<span class='rotate-minus-", abs($data->seat->graph_angle), "'>", $data->seat->number, "</span></div>";
                        else
                            echo "<span class='rotate-", abs($data->seat->graph_angle), "'>", $data->seat->number, "</span></div>";
                    }
                } ?>
            </div>
        </div>
        <div class="booking-detail">
<?php $form=$this->beginWidget('CActiveForm', array(
	'id'=>'ticket-form',
    'action'=>array('/Events/default/order', 'category'=>$model->category->url, 'url'=>$model->url),
    //'action'=>array('/Events/default/preOrder', 'id'=>$model->id),
	'enableClientValidation'=>false,
	'clientOptions'=>array(
		'validateOnSubmit'=>false,
	),
	'htmlOptions'=>array(
		'class'=>'',
	),
)); ?>
            <h3 class="text-center">Thông tin vé</h3>
            <?php foreach ($model->tickets as $x => $ticket): ?>
            <div class="row ticket" id="ticket-<?php echo $ticket->id; ?>">
                <div class="col-md-8"><strong><?php echo $ticket->title; ?></strong> (<?php echo number_format($ticket->price, 0, ',', '.') . ' VNĐ'; ?>)</div>
                <div class="col-md-4 text-right"><span class="ticket-number">0</span> vé</div>
                <div class="col-md-12 ticket-title"></div>
            </div>
            <?php endforeach; ?>
            <div class="row ticket">
                <div class="col-md-6"><strong>Tổng số tiền</strong></div>
                <div class="col-md-6 text-right"><span id="total">0</span> VNĐ</div>
                <input type="hidden" name="total-input" id="total-input" value="0" />
                <input type="hidden" name="total-ticket" id="total-ticket" value="0" />
            </div>
            <div class="booking-submit">
                <button type="submit" class="btn btn-block">Đặt vé</button>
            </div>
<?php $this->endWidget(); ?>
        </div>
    </div>
    <div class="clear"></div>
    <div class="booking-footer">
        <p class="text-center">Mọi thông tin chi tiết vui lòng liên hệ qua <strong>Hotline: 0969.836.599</strong></p>
    </div>
</div>
<script type="text/javascript">
$(document).on('ready', function(){
    // Tooltips
    //$('.booking-seat').tooltip();
});
function checkSeat(id, ticket) {
    var seat = $('#seat-'+id);
    if (seat.hasClass('booking-checked')) {
        // Remove invoice
        $.ajax({
            url: '<?php echo Yii::app()->createUrl('/Events/booking/unCheck'); ?>',
            type: 'POST',
            data: {
                'id': id,
                'ticket': ticket
            },
            dataType: 'JSON',
            success: function(data){
                // Update invoice
                $('#ticket-'+ticket+' .ticket-number').text(parseInt($('#ticket-'+ticket+' .ticket-number').text()) - 1);
                $('#ticket-title-'+data.id).remove();
                
                $('#total-ticket').val(parseInt($('#total-ticket').val()) - 1);
                $('#total-input').val(parseInt($('#total-input').val()) - parseInt(data.price));
                $('#total').text(formatNumber(parseInt($('#total-input').val())));
                // Remove input
                $('#SeatTickets-'+id).remove();
            },
            error: function(){

            },
            timeout: 30000,
        });
        // Set status
        seat.removeClass('booking-checked');
    }
    else {
        // Request
        $.ajax({
            url: '<?php echo Yii::app()->createUrl('/Events/booking/check'); ?>',
            type: 'POST',
            data: {
                'id': id,
                'ticket': ticket
            },
            dataType: 'JSON',
            success: function(data){
                // Update invoice
                $('#ticket-'+ticket+' .ticket-number').text(parseInt($('#ticket-'+ticket+' .ticket-number').text()) + 1);
                $('#ticket-'+ticket+' .ticket-title').append('<span id="ticket-title-'+data.id+'">'+data.title + ', </span>');
                
                $('#total-ticket').val(parseInt($('#total-ticket').val()) + 1);
                $('#total-input').val(parseInt($('#total-input').val()) + parseInt(data.price));
                $('#total').text(formatNumber(parseInt($('#total-input').val())));
                // Insert input
                $('#ticket-'+ticket).append('<input type="hidden" name="SeatTickets['+ticket+'][]" value="'+id+'" id="SeatTickets-'+id+'" />');
            },
            error: function(){

            },
            timeout: 30000,
        });
        // Set status
        seat.addClass('booking-checked');
    }
}
function formatNumber(number)
{
    number = number.toFixed(2) + '';
    x = number.split('.');
    x1 = x[0];
    x2 = x.length > 1 ? '.' + x[1] : '';
    var rgx = /(\d+)(\d{3})/;
    while (rgx.test(x1)) {
        x1 = x1.replace(rgx, '$1' + ',' + '$2');
    }
    return x1;
}
</script>